<template>
    <div class="common-layout">
        <el-container>
            <el-header>

                <el-menu class="el-menu-demo" mode="horizontal" style="background-color: #333333; margin-left: 150px;">
                    <span style="color: aliceblue;margin-top: 15px;margin-left: 100px;">公司名称</span>
                    <el-menu-item index="3"><span style="color: aliceblue;">集团管理</span></el-menu-item>
                    <el-menu-item index="4"><span style="color: aliceblue;">企业管理</span></el-menu-item>
                    <el-menu-item index="5"><span style="color: aliceblue;">平台运营</span></el-menu-item>
                    <el-menu-item index="6"><span style="color: aliceblue;">系统设置</span></el-menu-item>
                </el-menu>
            </el-header>
            <el-container>
                <el-aside width="200px">
                    <el-col :span="24">
                        <el-menu active-text-color="balck" background-color="#EFF2F5" class="el-menu-vertical-demo"
                            default-active="2" router>
                            <el-sub-menu index="1">
                                <template #title>
                                    <el-icon>
                                        <location />
                                    </el-icon>
                                    <span>企业管理</span>
                                </template>
                                <el-menu-item-group title=" ">
                                    <el-menu-item index="/Management">溯源管理</el-menu-item>
                                    <el-menu-item index="/about">item two</el-menu-item>
                                </el-menu-item-group>
                            </el-sub-menu>
                        </el-menu>
                    </el-col>
                </el-aside>
                <el-main>
                    <RouterView />

                </el-main>
            </el-container>
        </el-container>
    </div>
</template>

<script lang="ts" setup>
import { RouterLink, RouterView } from 'vue-router'
import { useRoute, useRouter } from 'vue-router';
import {
    Document,
    Menu as IconMenu,
    Location,
    Setting,
} from '@element-plus/icons-vue'
const router = useRouter();
const route = useRoute();
</script>


<style>
.el-header {
    background-color: #333333;
    width: 100%;
}

.el-aside {
    background-color: #EFF2F5;
    height: 100vh;
}
</style>